<template>
  <!-- 修改个人信息 -->
  <view class="personPetname">
    <view>
      <button
        class="personImg"
        open-type="chooseAvatar"
        @chooseavatar="userPhotoHandle"
      >
        <image
          class="avatar"
          :src="
            userList.avateor ? userList.avateor : baseImgUrl + 'queryFace.png'
          "
          mode="aspectFill"
        ></image>
      </button>
    </view>
    <view>
      <u-cell-group>
        <u-cell title="昵称" :border-top="true">
          <view slot="value" class="cell-noEmpty">
            <u--input
              v-model="userList.realName"
              type="nickname"
              class="weui-input"
              placeholder="请输入昵称"
              border="none"
              @input="handleInput"
              :maxlength="30"
            ></u--input>
          </view>
        </u-cell>
      </u-cell-group>

      <view class="btns" style="margin-top: 50rpx">
        <button
          class="submit-btn"
          type="primary"
          icon="map"
          style="width: 50%"
          @click="submithandle"
        >
          保存
        </button>
      </view>
    </view>
  </view>
</template>

<script>
import { miniUserEdit } from "@/api/myself.js";
import { Toast, navBack } from "@/utils/util.js";

export default {
  name: "personPetname",
  data() {
    return {
      userList: uni.getStorageSync("user"),
      baseImgUrl: this.$baseImgUrl,
      baseURL: this.$baseURL,
    };
  },
  onShow() {},
  methods: {
    userPhotoHandle(e) {
      var _this = this;
      const { avatarUrl } = e.detail;

      uni.uploadFile({
        url: _this.baseURL + "/mini/sys/upload/upload_file",
        filePath: avatarUrl,
        name: "file",
        header: {
          "content-type": "application/json", // 默认值
          "X-MINI-TOKEN": uni.getStorageSync("X-MINI-TOKEN"),
        },
        formData: {
          type: 2,
        },
        success(res) {
          let { fullPath, halfPath } = JSON.parse(res.data).result;
          _this.userList.avateor = fullPath;
        },
      });
    },
    handleInput(e) {
      this.userList.realName = e;
    },
    submithandle() {
      let data = {
        avateor: this.userList.avateor,
        realName: this.userList.realName,
      };
      miniUserEdit(data).then((res) => {
        if (res.code == 200) {
          uni.setStorageSync("user", this.userList);
          Toast("保存成功");
          navBack();
        }
      });
    },
  },
};
</script>

<style lang="scss" scoped>
.personPetname {
  .personImg {
    margin: 50rpx auto;
    padding: 0;
    width: 100rpx;
    height: 100rpx;
    border-radius: 50%;
    image {
      height: 100%;
      width: 100%;
      border-radius: 50%;
    }
  }

  .cell-noEmpty {
    flex: 4;
  }
}
</style>
